<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网络场景</title>
    <style>
        html,
        body,
        #viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
        #titleDiv {
            background-color: lightgray;
            color: black;
            padding: 5px;
            position: absolute;
            z-index: 2;
            top: 0;
            right: 0;
            font-size: 20pt;
            font-weight: bolder;
            width: 100%;
            height: 30px;
            text-align: center;
            opacity: 0.75;
        }
    </style>
    <link href="https://js.arcgis.com/4.21/esri/themes/light/main.css" rel="stylesheet"/>
    <script src="https://js.arcgis.com/4.21/"></script>
    <script>
        require(["esri/views/SceneView", "esri/WebScene"], (SceneView, WebScene) => {
            var titleDiv = document.getElementById("titleDiv");

            let scene = new WebScene({
                portalItem:{
                    title:"冬天的阳光时间线",
                    id: "affa021c51944b5694132b2d61fe1057"
                }
            });

            let view = new SceneView({
                map:scene,
                container:"viewDiv",
            });

            scene.when(()=>{});//已创建所有图层和底图

            view.when(()=>{//所有图层和底图资源均已加载并准备好显示
                let title = scene.portalItem.title;
                titleDiv.innerHTML=title;
            });
        });
    </script>
</head>
<body>
<div id="viewDiv" class="esri-widget"><div id="titleDiv"></div></div>
</body>
</html>
